<?php get_header('gallery');?>
<!-- Trang nha hang -->
<body>
<div id="wrapper">
	<?php require_once TEMPLATEPATH.'/views/view-header.php';?>
    <?php require_once TEMPLATEPATH.'/views/view-menu.php';?>
    <div id="header-third">
    		<!--slideshow-->
 		   	<?php require_once TEMPLATEPATH.'/views/view-slide-show.php';?>
		    <!--end slideshow--> 
            <!--container-->
         <div id="container">
         <?php require_once TEMPLATEPATH.'/views/view-breadcrumb.php';?>
         <div class="clear"></div>
         <!--main content-->
            <div id="maincontent">
            	<?php 
            	$gallerys = db_select_all_data("gallerys");  
            	$uploaddir = wp_upload_dir();
            	$mypath = $uploaddir['baseurl'].'/';
            	//print_r($uploaddir);          	
            	?>
            	
            	<div id="page-index" class="page-library-08">                
                	<div class="gioithieu">                    
	                    <h3>Gallery</h3>                        
                      <div class="clear"></div>
                      	<!-- Start Advanced Gallery Html Containers -->	
                <div class="content">
                <center>
					<div class="slideshow-container">
						<div id="loading" class="loader"></div>
						<div id="slideshow" class="slideshow"></div>
					</div></center>
					<div id="caption" class="caption-container">
						
					</div>
				</div>
                <!-- nguồn -->	
                <div class="clear"></div>                
				<div class="navigation-container">
					<div id="thumbs" class="navigation">
 						<a class="pageLink prev" style="visibility: hidden;" href="#" title="Previous Page"></a>											
						<ul class="thumbs noscript">
							<?php 
							if($gallerys)
							{
								foreach ($gallerys as $value) 
								{
									$thumbnail = $mypath.$value->url;
								?>
								<li>
									<a class="thumb" name="leaf" href="<?php echo $thumbnail;?>" title="Title #0">
										<img src="<?php bloginfo('stylesheet_directory'); ?>/timthumb.php?src=<?php echo $thumbnail;?>&w=75&h=75" border="0"" alt="Title #0" />
									</a>								
								</li>
								<?php 	
								}
							}
							?>							
						</ul>
<a class="pageLink next" style="visibility: hidden;" href="#" title="Next Page"></a>
					</div>
				</div>				
				<!-- End Gallery Html Containers -->
				<div style="clear: both;"></div>
				<script type="text/javascript">
			jQuery(document).ready(function($) {
				$('div.content').css('display', 'block');
				var onMouseOutOpacity = 0.67;
				$('#thumbs ul.thumbs li, div.navigation a.pageLink').opacityrollover({
					mouseOutOpacity:   onMouseOutOpacity,
					mouseOverOpacity:  1.0,
					fadeSpeed:         'fast',
					exemptionSelector: '.selected'
				});
				var gallery = $('#thumbs').galleriffic({
					delay:                     2500,
					numThumbs:                 6,
					preloadAhead:              7,
					enableTopPager:            false,
					enableBottomPager:         false,
					imageContainerSel:         '#slideshow',
					controlsContainerSel:      '#controls',
					captionContainerSel:       '#caption',
					loadingContainerSel:       '#loading',
					renderSSControls:          true,
					renderNavControls:         true,
					nextPageLinkText:          'Next &rsaquo;',
					prevPageLinkText:          '&lsaquo; Prev',
					enableHistory:             true,
					autoStart:                 true,
					syncTransitions:           true,
					defaultTransitionDuration: 900,
					onSlideChange:             function(prevIndex, nextIndex) {
						this.find('ul.thumbs').children()
							.eq(prevIndex).fadeTo('fast', onMouseOutOpacity).end()
							.eq(nextIndex).fadeTo('fast', 1.0);
						this.$captionContainer.find('div.photo-index')
							.html('Photo '+ (nextIndex+1) +' of '+ this.data.length);
					},
					onPageTransitionOut:       function(callback) {
						this.fadeTo('fast', 0.0, callback);
					},
					onPageTransitionIn:        function() {
						var prevPageLink = this.find('a.prev').css('visibility', 'hidden');
						var nextPageLink = this.find('a.next').css('visibility', 'hidden');
						if (this.displayedPage > 0)
							prevPageLink.css('visibility', 'visible');
						var lastPage = this.getNumPages() - 1;
						if (this.displayedPage < lastPage)
							nextPageLink.css('visibility', 'visible');
						this.fadeTo('fast', 1.0);
					}
				});
				gallery.find('a.prev').click(function(e) {
					gallery.previousPage();
					e.preventDefault();
				});
				gallery.find('a.next').click(function(e) {
					gallery.nextPage();
					e.preventDefault();
				});
				function pageload(hash) {
					if(hash) {
						$.galleriffic.gotoImage(hash);
					} else {
						gallery.gotoIndex(0);
					}
				}
				$.historyInit(pageload, "advanced.html");
				$("a[rel='history']").live('click', function(e) {
					if (e.button != 0) return true;
					var hash = this.href;
					hash = hash.replace(/^.*#/, '');
					$.historyLoad(hash);
					return false;
				});
			});
		</script> 
                    	
                                        	
                    </div>
                    
         
         		<?php require_once TEMPLATEPATH.'/views/view-out-service.php';?>
                    
                </div>
                    
                    
                   
                    
                
                
                
            </div>
            <!--main content-->
            <!--sidebar-right-->
            <?php get_sidebar();?> 
            <!--sidebar-right-->
            <div class="clear"></div> 
        </div>
        <!--container-->
        <!--bgfooter-->
<?php get_footer();?>
          